import React from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { PageProps } from '@/typings/react.type';
import { RootState, Dispatch } from '@/store';
import styles from './index.module.less';

const Index = (props: PageProps) => {
  const dispatch = useDispatch<Dispatch>();
  const appStore = useSelector((state: RootState) => state.app);

  const goPage = () => {
    props.history.push({
      pathname: '/demo',
    });
  };

  return (
    <div className={styles.header} style={{ padding: 24, background: '#fff' }}>
      <button onClick={goPage}>跳转demo页</button>
      <div className={styles.bg}></div>
      <div style={{ marginTop: 20, marginBottom: 20 }}>
        <p>num参数：{appStore.num}</p>
      </div>

      <button
        onClick={() => {
          // dispatch.app.addNum();
        }}
      >
        store num++
      </button>
    </div>
  );
};

export default Index;
